<template>
  <h1>El-开关组件</h1>
  <el-switch v-model="value1" />
  <el-switch
      v-model="value2"
      class="ml-2"
      style="--el-switch-on-color: #0aa1ed; --el-switch-off-color: #f00"
  />
  <hr>
  是否为管理员<el-switch v-model="isAdmin"/>
  是否显示图片<el-switch v-model="isShow"/>
  <hr>
  <img src="fcq.jpg" width="200" v-if="isShow">
<!-- 扩展类型：支持number与string:active-value="开关打开的值"：inactive-value="开关关闭的值" -->
  <el-switch v-model="num" active-value="1" inactive-value="0"/>
  <el-switch v-model="numStr" active-value="1" inactive-value="0"/>
</template>

<script setup>
import { ref } from 'vue'
import {inputNumberEmits} from "element-plus";

const value1 = ref(true)
const value2 = ref(false)
const isAdmin = ref(false);
const isShow = ref(false);
const num = ref(0);
const numStr = ref('1');
</script>


<style scoped>

</style>